<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

</body>
<script>
    //  Promise 承诺
    // setTimeout(()=>{
    //     console.log(111)
    //     setTimeout(()=>{
    //         console.log(2222)
    //         setTimeout(()=>{
    //             console.log(3333)
    //         },3000)
    //     },2000)
    // },1000)
    // 只要是异步编程就一定会伴随着有回调函数。就有可能存在回调地狱的问题
    // Promise就是用来解决异步编程回调地狱问题的
    // Promise 三个状态 等待 成功 失败 两个过程 等待=>成功 等待=>失败 状态一旦发生改变就不会在改变
    // 创建promise对象
    let p  = new Promise((reslove,reject)=>{
        //reslove 将状态改变为成功 reject将状态变为是失败
        reslove("成功啦")
        // reject("失败了·")
    });
    console.log(p)
    // .then方法获取成功或失败的值 参数一 成功回调 参数二失败回调
    p.then((res)=>{
        console.log(res)
        console.log("只有状态变为成功进入该回调")
    },(err)=>{
        console.log(err)
        console.log("只有失败状体才会进入该回调")
    })
    let p1  = new Promise((reslove,reject)=>{
        reject("失败哈哈哈哈哈")
    })
    // 用来捕获失败状态
    p1.catch((err)=>{
        console.log(err)
    })
    // p1.finally(()=>{
    //     console.log("成功或失败都会进入")
    // })
    // 使用propmise 封装xhr
    function sendHttp(url,method){
         return new Promise((reslove,reject)=>{
            let xhr = new XMLHttpRequest();
            xhr.open(method,url);
            xhr.send();
            xhr.onreadystatechange=()=>{
                if(xhr.readyState===4){
                    let res = JSON.parse(xhr.response);
                    reslove(res)
                }
            }
         })
    }
    sendHttp("https://apif.java.crmeb.net/api/front/index",'get').then(res=>{
        console.log(res)
        return sendHttp('https://apif.java.crmeb.net/api/front/product/leaderboard','get')
    }).then((res)=>{
        console.log(res)
    })
</script>
</html>